<nz-dropdown>
  <a nz-dropdown> {{ selected }} <i nz-icon type="down"></i> </a>
  <ul nz-menu nzSelectable>
    <li
      nz-menu-item
      *ngFor="let item of menuitems"
      (click)="selectChange(item)"
    >
      {{ item.pageTitle }}
    </li>
  </ul>
</nz-dropdown>

<button nz-button nzType="primary" class="analytics" (click)="toRouter()">
  <i nz-icon nzType="area-chart">考试分析详情</i>
</button>
<div class="score-charts">
  <div id="c1" class="bar-chart"></div>

  <div class="ranking">
    成绩排名(前十名)
    <span>查看所有</span>
    <nz-list
      [nzDataSource]="top10List"
      [nzRenderItem]="item"
      [nzItemLayout]="'horizontal'"
    >
      <ng-template #item let-item>
        <nz-list-item>
          <nz-list-item-meta [nzTitle]="nzTitle">
            <ng-template #nzTitle>
              <ng-container *ngIf="item.index <= 3; else elseTemplate">
                <div class="number number-active">{{ item.index }}</div>
              </ng-container>
              <ng-template #elseTemplate>
                <div class="number">{{ item.index }}</div>
              </ng-template>
              {{ item.studentNumber }}/{{ item.studentName }} | {{ item.score }}
            </ng-template>
          </nz-list-item-meta>
        </nz-list-item>
      </ng-template>
    </nz-list>
  </div>
</div>

<div class="student-table">
  <app-student-table
    [studentScore]="studentScoreTableList"
    [pageId]="pageId"
  ></app-student-table>
</div>
